// @ts-ignore
// @ts-ignore
import {Drawer, Table, Tag, Typography} from 'antd';
import {record} from "@umijs/utils/compiled/zod";

const { Paragraph, Title } = Typography;

const requestHeaderColumns: any = [
  {
    title: '名称',
    dataIndex: 'name',
    key: 'name',
  },
  {
    title: '值',
    dataIndex: 'value',
    key: 'value',
  },
];
const requestParamColumns: any = [
  {
    title: '名称',
    dataIndex: 'name',
    key: 'name',
  },
  {
    title: '必填',
    dataIndex: 'required',
    key: 'required',
    render:(text,record) =>{
      return record.required
        ? <Tag color="success">是</Tag>
        : <Tag color="error">否</Tag>
  }
  },
  {
    title: '类型',
    dataIndex: 'type',
    key: 'type',
  },
  {
    title: '说明',
    key: 'description',
    dataIndex: 'description',
  },
];

const responseParamColumns: any = [
  {
    title: '名称',
    dataIndex: 'name',
    key: 'name',
  },
  {
    title: '类型',
    dataIndex: 'type',
    key: 'type',
  },
  {
    title: '说明',
    key: 'description',
    dataIndex: 'description',
  },
];

// @ts-ignore
export default ({ currentInterfaceDetail: interfaceInfo, openDrawer, closeDrawer }) => {
  const onClose = () => {
    closeDrawer();
  };

  return (
    <>
      <Drawer title={interfaceInfo?.name} onClose={onClose} open={openDrawer} size={'large'}>
        <Paragraph copyable>接口地址:{interfaceInfo?.url}</Paragraph>
        <Paragraph>请求方式:{interfaceInfo?.method}</Paragraph>
        <Paragraph>返回类型:json</Paragraph>
        <Paragraph>接口描述:{interfaceInfo?.description}</Paragraph>
        <Paragraph>接口调试:API测试工具</Paragraph>
        <Title level={5}>请求Header:</Title>
        <Table
          size={'small'}
          columns={requestHeaderColumns}
          dataSource={
            interfaceInfo?.requestHeader
              ? JSON.parse(interfaceInfo?.requestHeader)
              : JSON.parse('[]')
          }
          pagination={{ hideOnSinglePage: true }}
        />
        <Title level={5}>请求参数:</Title>
        <Table
          size={'small'}
          columns={requestParamColumns}
          dataSource={
            interfaceInfo?.requestParam ? JSON.parse(interfaceInfo?.requestParam) : JSON.parse('[]')
          }
          pagination={{ hideOnSinglePage: true }}
        />
        <Title level={5}>返回参数说明：:</Title>
        <Table
          size={'small'}
          columns={responseParamColumns}
          dataSource={
            interfaceInfo?.responseBody ? JSON.parse(interfaceInfo?.responseBody) : JSON.parse('[]')
          }
          pagination={{ hideOnSinglePage: true }}
        />
      </Drawer>
    </>
  );
};
